<template>
    <div class="box">
        <div>msg: {{ msg }}</div>
        <div>username: {{ userinfo.username }}</div>
        <div>age: {{ userinfo.age }}</div>
        <Child 
        v-bind:msg='msg'
        :userinfo="userinfo"
        :changeMsg="changeMsg"
        ></Child>
    </div>
</template>

<script>

import Child from './Child.vue'
export default {
    name: "PropsTest",
    components: { Child },
    data() {
        return {
            msg: '南通',
            userinfo: {
                username: '葛晨',
                age: 250
            }
        }
    },
    methods: {
        changeMsg() {
            this.msg +='是搁辰'
        }
    }
}
</script>

<style scoped>

</style>